import { createRouter, createWebHashHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import StockList from '../components/StockList.vue'
import StockDetails from '../components/StockDetails.vue'
import StockHistory from '../components/StockHistory.vue'
import Login from '../components/Login.vue'
import Register from '../components/Register.vue'
import Portfolio from '../components/Portfolio.vue'
import TradeHistory from '../components/TradeHistory.vue'
import Strategy from '../components/Strategy.vue'
import StockSearch from '../components/StockSearch.vue'

const router = createRouter({
  history: createWebHashHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      name: 'home',
      component: HomeView,
    },
    {
      path: '/login',
      name: 'login',
      component: Login,
    },
    {
      path: '/register',
      name: 'register',
      component: Register,
    },
    {
      path: '/stocks',
      name: 'stocks',
      component: StockList,
    },
    {
      path: '/stocks/:symbol',
      name: 'stock-details',
      component: StockDetails,
      props: true
    },
    {
      path: '/stock-history',
      name: 'stock-history',
      component: StockHistory,
    },
    {
      path: '/portfolio',
      name: 'portfolio',
      component: Portfolio,
    },
    {
      path: '/trades',
      name: 'trades',
      component: TradeHistory,
    },
    {
      path: '/strategies',
      name: 'strategies',
      component: Strategy,
    },
    {
      path: '/stock-search',
      name: 'stock-search',
      component: StockSearch,
    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (About.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import('../views/AboutView.vue'),
    },
  ],
})

export default router